<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="${staticServer}/inc/style/main.css" />
<link rel="stylesheet" href="${staticServer}/inc/style/page.css" />
<link rel="stylesheet" href="${staticServer}/inc/style/date/datepicker.css" />
<link rel="stylesheet" href="${staticServer}/css/work_today.css" />
<link rel="stylesheet" href="${staticServer}/css/consultant_client_reserve.css" />
<script src="${staticServer}/inc/js/jquery.js"></script>
<script src="${staticServer}/inc/js/pageset.js"></script>
<script src="${staticServer}/inc/js/model_resp.js"></script>
<script src="${staticServer}/inc/js/model_win.js"></script>
<script src="${staticServer}/inc/js/infopad.js?2.2"></script>
<script src="${staticServer}/inc/js/datepicker.js"></script>
<script src="${staticServer}/inc/js/submitter.js"></script>
<script src="${staticServer}/js/web/consultant_client_reserve.js?2.2"></script>

<script>
var contextPath='${contextPath}';
var path = '${staticServer}';

$(function(){
	//text
	init_invalid_td();
	
	$("#region").val("${region}");
	getFollow();
	
	if(${BeforetwoDay}==${.now}){
		$("#yidate").parent().addClass("today");
	}
	
	if(${BeforeDay}==${.now}){
		$("#erdate").parent().addClass("today");
	}
	
	if(${today}==${.now}){
		$("#sadate").parent().addClass("today");
	}
	
	if(${tommorrow1}==${.now}){
		$("#sidate").parent().addClass("today");
	}
	
	if(${tommorrow2}==${.now}){
		$("#wudate").parent().addClass("today");
	}
	
	if(${tommorrow3}==${.now}){
		$("#lidate").parent().addClass("today");
	}
	
	if(${tommorrow4}==${.now}){
		$("#qidate").parent().addClass("today");
	}
		

});

var getFollow = function(){
	var region = $("#region").val();
	var date = $("#datetime").val();
	$.post("${contextPath}/index/get_client_reserve.json", {
		"region":region,
		"date":date
	}, function(ms) {
		var list = ms.list;
		for(var j=0;j<list.length;j++){
			var re = new RegExp("-", "g");
			var ids = (list[j].dates).replace(re,"")+(list[j].time).replace(":","");
			var htm = $("#"+ids).html(" ");
		}
		
		for(var i=0;i<list.length;i++){
			var objHtml = ""
			var re = new RegExp("-", "g");
			var ids = (list[i].dates).replace(re,"")+(list[i].time).replace(":","");
			var keyname = "";
			var stuNickname = "";
			var keyname = "";
			var id = "";
			var age = "";
			var sex = "";
			keyname = list[i].keyname;
			var nons = '';
			if(list[i].state=="1"){
				if(list[i].non == "1"){
					var classs='line-height: 20px; text-align: center; color: rgb(237, 237, 237); cursor: pointer; background-image: url(&quot;${staticServer}/img/sms.png&quot;); background-color:rgb(176, 75, 135); background-position: 96% 2px; background-repeat: no-repeat;';
					var class1 = 'color:#eee;font-size:12px;border-top:1px dotted #eee;';
				}else{
					var classs="line-height: 20px; text-align: center; color: rgb(255, 255, 255); cursor: pointer; background-image: url(&quot;${staticServer}/img/sms.png&quot;); background-color: rgb(213, 177, 248); background-position: 96% 2px; background-repeat: no-repeat;"
					var class1 = 'color:#eee;font-size:12px;border-top:1px dotted #eee;';
				}
			}else if(list[i].state=="2"){
				if(list[i].non == "1"){
					nons = '<em style="color:#ff0000;float:left">非</em>';
				}
				var classs='line-height: 20px; text-align: center; color: rgb(51, 51, 51); cursor: pointer; background-image: url(&quot;${staticServer}/img/sms.png&quot;); background-color: rgb(231, 248, 177); background-position: 96% 2px; background-repeat: no-repeat;';
				var class1 = 'color:#ccc;font-size:12px;border-top:1px dotted #ccc;';
			}else if(list[i].state=="3"){
				if(list[i].non == "1"){
					nons = '<em style="color:#ff0000;float:left">非</em>';
				}
				var classs='line-height: 20px; text-align: center; color: rgb(237, 237, 237); cursor: pointer; background-image: url(&quot;${staticServer}/img/sms.png&quot;); background-color: rgb(204, 204, 204); background-position: 96% 2px; background-repeat: no-repeat;';
				var class1 = 'color:#eee;font-size:12px;border-top:1px dotted #eee;';
			}
			
			id = list[i].client;
			var a = list[i].students.length;
			var stu = "";
			var stunick="";
			
			for(var k=0;k<a;k++){
					age = list[i].students[k].age;
					sex = list[i].students[k].sex;
					stuNickname = list[i].students[k].nickname;
				  stu ='<br>'+stuNickname+'，'+sex+'，'+age+'岁';
				  stunick +=stu;
				}
				
			objHtml = '<div id="'+list[i].keyname+'" name="'+list[i].client+'" class="unit"  rel="'+list[i].dates+'" title="[ '+list[i].time+' ] '+list[i].nickname+' | '+list[i].sourcens+' | '+list[i].categoryns+'( 发起人：'+list[i].sponsor+' )" style="'+classs+'">'+nons+' '+list[i].nickname+' '+ stunick+''+'<br><p style="'+class1+'">'+list[i].startTime+'</p></div>';
			$("#"+ids).append(objHtml);
			var tar = $("#"+keyname);
			tar.click( tdViewHandler );
		}
	});
}


</script>
</head>

<body>
	<div id="home_link">
		<ul>
			<li></li>
			<li>&gt;</li>
			<li>咨询师业务管理</li>
			<li>&gt;</li>
			<li class="current">客户预约</li>
		</ul>
	</div>
	<div id="container">
	 <div id="title">客户预约（今日日期：${.now}）</div>
		<table class="form_table">
			<tr>
				<td><label><b>更换日期：</b></label>
                	<select id="region">
                		<#if office_List??>
                			<#list office_List as list>
                				<option value="${list.keyname}">${list.name}</option>
                			</#list>
                		</#if>
                	</select>
						<input type="text" readyonly="true" id="datetime" value="${newday}" size="20" maxlength="20" readonly class="DatePicker_Icon">
	                    <input type="button" value=" 刷新 " onclick="cdatetime(2)" />
	                    <input type="button" value=" 上一周 " onclick="cdatetime(-1)" />
	                    <input type="button" value=" 下一周 " onclick="cdatetime(1)" />
	                    <input type="button" value=" 最近一周 " onclick="cdatetime(0)" />
                    </td>
			</tr>
			<tr>
				<td id="office_info">
				<label><b>中心地址</b>：<span class="unit">${office.address}</span></label><label><b>联系电话</b>：<span class="unit">${office.inphone}</span></label>
				<label><b>休息日：</b>
				<#if office.restday??>
				<#assign days= "${office.restday}" >
				<#list office.restday?split(",") as day>
				<#if day == 1>
					<#assign day1 = "星期一">
				 <#elseif day==2>
				 	<#assign day1 = "星期二">
				 <#elseif day == 3 >
				 	<#assign day1 = "星期三">
				 <#elseif day == 4 >
				 	<#assign day1 = "星期四">
				 <#elseif day == 5 >
				 	<#assign day1 = "星期五">
				 <#elseif day == 6 >
				 	<#assign day1 = "星期六">
				 <#elseif day == 7 >
				 	<#assign day1 = "星期七">
				</#if>
				<span class="unit">${day1}</span>
				</#list>
				</#if>
				</label><br/>
				<label><b>接待咨询师</b>：</label>
				<select name="target" id="target">
                	<option value="">-- 请选择目标 --</option>
                	<#if uList??>
						<#list uList as list>
                			<option value="${list.username}">${list.nickname}（${list.regions}-${list.departments}-${list.job}）</option>
                		</#list>
                	</#if>
                	<#if uList1??>
						<#list uList1 as list1>
                			<option value="${list1.username}">${list1.nickname}（${list1.regions}-${list1.departments}-${list1.job}）</option>
                		</#list>
                	</#if>
                </select>
				<label><b>可同时测试数量</b>：</label><input style="width:50px;" class="unit" readonly="true" id="unum" value="${office.unum}" type="text"></td>
			</tr>
			<tr>
				<td id="office_notice"><label><b>中心通知</b>：</label><br>
					<div id="content" style="width: 95%; margin: 0 auto;"><div><div>${office.notice}<br></div></div><p><span><span></span></span></p></div></td>
			</tr>
		</table>
		<table id="reservelst" rel="nohover">
			<tbody><tr id="weekrow" class="even_row">
				<th width="8%"></th>
				<th class="week"  width="13%">
					<span id="yidate">${BeforetwoDay}</span><br><span id="yi">星期一</span></th><th class="week" width="13%"><span id="erdate">${BeforeDay}</span><br><span id="er">星期二</span></th><th class="week" width="13%"><span id="sadate">${today}</span><br><span id="san">星期三</span></th><th class="week" width="13%"><span id="sidate">${tommorrow1}</span><br><span id="si">星期四</span></th><th class="week" width="13%"><span id="wudate">${tommorrow2}</span><br><span id="wu">星期五</span></th><th class="week" width="13%"><span id="lidate">${tommorrow3}</span><br><span id="liu">星期六</span></th><th class="week" width="13%"><span id="qidate">${tommorrow4}</span><br><span id="qi">星期日</span></th></tr>
					<#list dateMap?keys as key>
					<tr class="odd_row">
						<th class="time">${key}</th>
						
						<#assign key1 = "${key}:00">
						<#assign key2 = "${.now?date}${.now?string('HH:mm:ss')}">
						<#assign key3 = "${key2?replace('-','')?replace(':','')}">
						
						<#assign kname0_1 = "${BeforetwoDay?replace('-','')}${key1?replace(':','')}">
						<#if (kname0_1?number < key3?number)>
						<td id="${BeforetwoDay?replace('-','')}${key?replace(':','')}" rel="rest"></td>
						<#else>
						<td id="${BeforetwoDay?replace('-','')}${key?replace(':','')}" <#if days?contains("1") >rel="rest"</#if> ></td>
						</#if>
						
						<#assign kname0 = "${BeforeDay?replace('-','')}${key1?replace(':','')}">
						<#if (kname0?number < key3?number)>
						<td id="${BeforeDay?replace('-','')}${key?replace(':','')}"  rel="rest"></td>
						<#else>
						<td id="${BeforeDay?replace('-','')}${key?replace(':','')}" <#if days?contains("2") >rel="rest"</#if> ></td>
						</#if>
						
						<#assign kname = "${today?replace('-','')}${key1?replace(':','')}">
						<#if (kname?number < key3?number)>
						<td id="${today?replace('-','')}${key?replace(':','')}"  rel="rest"></td>
						<#else>
						<td id="${today?replace('-','')}${key?replace(':','')}" <#if days?contains("3") >rel="rest"</#if> ></td>
						</#if>
						 
						<#assign kname1 = "${tommorrow1?replace('-','')}${key1?replace(':','')}">
						<#if (kname1?number < key3?number)>
						<td id="${tommorrow1?replace('-','')}${key?replace(':','')}"  rel="rest"></td>
						<#else>
						<td id="${tommorrow1?replace('-','')}${key?replace(':','')}" <#if days?contains("4") >rel="rest"</#if> ></td>
						</#if>
						
						<#assign kname2 = "${tommorrow2?replace('-','')}${key1?replace(':','')}">
						<#if (kname2?number < key3?number)>
						<td id="${tommorrow2?replace('-','')}${key?replace(':','')}"  rel="rest"></td>
						<#else>
						<td id="${tommorrow2?replace('-','')}${key?replace(':','')}" <#if days?contains("5") >rel="rest"</#if>></td>
						</#if>
						
						<#assign kname3 = "${tommorrow3?replace('-','')}${key1?replace(':','')}">
						<#if (kname3?number < key3?number)>
						<td id="${tommorrow3?replace('-','')}${key?replace(':','')}"  rel="rest"></td>
						<#else>
						<td id="${tommorrow3?replace('-','')}${key?replace(':','')}" <#if days?contains("6") >rel="rest"</#if>></td>
						</#if>
						
						<#assign kname4 = "${tommorrow4?replace('-','')}${key1?replace(':','')}">
						<#if (kname4?number < key3?number)>
						<td id="${tommorrow4?replace('-','')}${key?replace(':','')}"  rel="rest"></td>
						<#else>
						<td id="${tommorrow4?replace('-','')}${key?replace(':','')}" <#if days?contains("7") >rel="rest"</#if>></td>
						</#if>
						
					</tr>
					</#list>
			</tbody>
		</table>
		<div class="remark">
			<ul>
				<li>&nbsp;<span class="confirmed block">待确认的预约</span><span class="completed block">已测评的预约</span><span
					class="expired block">未出现的预约</span></li>
				<li><span class="title">提示说明：</span></li>
				<li>1、点击指定的日期时间对应的单元格进行预约操作，操作前建议先“刷新”</li>
				<li>2、预约成功后分为3种状态：1-待确认；2-已出现；3-已过期</li>
				<li>3、同一客户可以存在多个“待确认”的预约记录，只要这些预约的接待时间不冲突即可</li>
				<li>4、灰色背景，显示 “closed” 的单元格为不可预约时间（休息日、过去的时间）</li>
				<li>&nbsp;</li>
			</ul>
		</div>
	</div>
	<div class="emptyline"></div>
</body>
</html>